<template>
	<view style="padding: 20px 0;">
		<view v-if="list.length==0" style="text-align: center; margin-top: 10px;">
			暂无申请
		</view>
		<view class="list" v-for="application in list" :key="application.applicationId">
			<view>
				<view style="text-align: center; margin-bottom: 20px;">
					{{application.groupName}}-{{application.position}}-{{application.name}}
				</view>
				<view>
					请假类型：{{application.type}}
				</view>
				<view>
					备注：{{application.notes}}
				</view>
				<view>
					开始时间：{{DateUtil(application.beginTime)}}
				</view>
				<view>
					结束时间：{{DateUtil(application.endTime)}}
				</view>
			</view>
			
			<!-- 间隔线 -->
			<u-line style="margin-top: 5px;"></u-line>
			
			<view>
				审批人：
			</view>
			<view class="approve" v-for="approve in application.approveList">
				<view class="a">
					{{approve.name}}:{{(approve.notes==null||approve.notes=="")?"无":approve.notes}}
				</view>
				<view class="b">
					<text v-if="approve.pass==0">待审批</text>
					<text v-if="approve.pass==1" style="color: green;">通过</text>
					<text v-if="approve.pass==2" style="color: red;">驳回</text>
				</view>
			</view>
		</view>
		
		<view class="send" @click="addApplication" v-if="type==0">
			新建申请
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				type:0,
			};
		},
		onLoad(e) {
			this.getApplication(e.type);
			this.type = e.type;
		},
		methods:{
			addApplication(){
				uni.navigateTo({
					url:"/pages/enterprise/addApplication/addApplication"
				})
			},
			DateUtil(e) {
				const date = new Date(e);
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			getApplication(type){
				uni.request({
					url: getApp().url + 'application/getApplicationList',
					data: {
						userId: uni.getStorageSync("userId"),
						enterpriseId: uni.getStorageSync("enterprise").enterpriseId,
						type:type
					},
					header: {
						token: uni.getStorageSync("token")
					},
					method: "GET",
					success: (response) => {
						if (response.data.code == -1) {
							return uni.showToast({
								icon: "error",
								title: response.data.msg
							});
						};
						this.list = response.data.data
					},
					fail: (error) => {
						console.log(error);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.list{
		margin: 5vw;
		padding: 5vw;
		border-radius: 10px;
		box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
		
		.approve{
			display: flex;
			
			.a{
				width: 80%;
			}
			
			.b{
				width: 20%;
			}
		}
	}
	
	.send {
		margin: 5vw;
		height: 40px;
		line-height: 40px;
		border-radius: 20px;
		text-align: center;
		color: #FFF;
		background-color: #41A863;
	}
</style>
